<template>
  <div >
    <el-dialog title="处理" :visible.sync="dialogShow" width="580px" @close="closeDialog" :close-on-click-modal='false'>
      <div class="disposeDialog_box dialogRightGray">
        <div class="form_Dialog_box form_DialogText_box FDACC">
          <el-form :model="dialogFrom" label-width="100px" :rules="rules">
            <el-form-item label="商品名称：" class="form_dialog_item">
              <div class="color_black form_Dialog_text">{{dialogFrom.title}}</div>
            </el-form-item>
            <el-form-item label="退款金额：" class="form_dialog_item">
              <div class="color_bsae form_Dialog_text">￥{{dialogFrom.refundFee}}</div>
            </el-form-item>
            <el-form-item label="退货数量：" class="form_dialog_item">
              <div class="color_black form_Dialog_text">{{dialogFrom.refundNum}}</div>
            </el-form-item>
            <el-form-item label="退款原因：" class="form_dialog_item">
              <div class="color_black form_Dialog_text">{{dialogFrom.refundReason}}</div>
              <img  v-for="(item,index) in dialogFrom.refundPics" :key="index" class="productImg" :src="item" alt="图片">
            </el-form-item>
            <el-form-item label="是否同意：" class="form_dialog_item" prop="sellerHandle">
              <el-radio-group v-model="dialogFrom.sellerHandle">
                <el-radio label="1">是</el-radio>
                <el-radio label="2">否</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="备注信息：" class="form_dialog_item" prop="sellerHandleRemark">
              <el-input type="textarea" v-model="dialogFrom.sellerHandleRemark"></el-input>
            </el-form-item>
          </el-form>
          <div class="explain">如是同意退货，请及时关注买家的发货情况，病进行收货（发货5天后可以选择未收到，超过7天不处理按弃货处理）。</div>
          <el-button class="baseBut bg_base" @click="submitDialog">确定</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  props: ["showTrue",'orderData'],
  data() {
    return {
      labelPosition:'right',
      dialogShow: false,
      rules:{
        sellerHandle: [
          { required: true, message: '请选择是否同意', trigger: 'change' }
        ],
        sellerHandleRemark:[
          { required: true, message: '请填写备注信息', trigger: 'change' }
        ],
      },
      dialogFrom:{
        sellerHandle:'1',
        sellerHandleRemark:'',
      }
    };
  },
  filters: {
    statusFil(val) {
      return val ? '同意退款' : '拒绝退款'
    },
  },
  watch: {
    showTrue(val) {
      this.dialogShow = val;
      this.dialogFrom={
        sellerHandle:'1',
        sellerHandleRemark:'',
      }
    },
    orderData(val){
      this.dialogFrom = {...val,...this.dialogFrom}
    }
  },
  created() {},
  mounted() {
  },
  methods: {
    closeDialog(){
      this.$emit("close");
    },
    submitDialog(){
      this.$emit("submit",this.dialogFrom);
    }
  }
};
</script>

<style scoped rel="stylesheet">
.form_dialog_item {
  width: 100% !important;
  margin-bottom: 4px !important;
}

.disposeDialog_box {
  width: 100%;
  overflow: hidden;
}
.form_Dialog_box {
  width: calc(100% - 40px);
  margin: 20px;
  overflow: hidden;
}
.form_DialogText_box {
  margin-bottom: 40px;
}
.explain{
  font-size:14px;
  font-family:PingFangSC-Regular,PingFang SC;
  font-weight:400;
  color:rgba(199,201,216,1);
  line-height:20px;
  margin-top: 15px;
  margin-left: 100px;
  margin: 15px 0 30px 100px;
  }
.productImg{
  width:64px;
  height:64px;
  background:rgba(216,216,216,1);
  margin-right: 20px;
}
</style>
